<template>
  <div class="mod-demo__wenben">
    <el-form :inline="true" :model="state.dataForm" @keyup.enter="state.getDataList()">
      <el-form-item>
        <el-button v-if="state.hasPermission('demo:wenben:save')" type="primary" @click="addOrUpdateHandle()">新增</el-button>
      </el-form-item>
      <el-form-item>
        <el-button v-if="state.hasPermission('demo:wenben:delete')" type="danger" @click="state.deleteHandle()">删除</el-button>
      </el-form-item>
      <el-upload :action= "Import_url":show-file-list="false" :on-success="handleImport" style="display: inline-block; margin-right: 10px; transform: translateY(-9px);" >
        <el-button  type="primary" plain>导入</el-button>
      </el-upload>
      <el-form-item>
        <el-button  type="info" @click="state.exportHandle()">导出</el-button>
      </el-form-item>
    </el-form>
    <el-table  v-loading="state.dataListLoading" :data="state.dataList"   @selection-change="state.dataListSelectionChangeHandle" style="width: 100% ;height: 500px" >
      <el-table-column type="selection"  header-align="center" align="center" width="40"></el-table-column>
              <el-table-column prop="id" label="ID" header-align="center" align="center"  ></el-table-column>
              <el-table-column prop="createBy" label="创建人" header-align="center" align="center"></el-table-column>
              <el-table-column prop="createTime" label="创建时间" header-align="center" align="center"></el-table-column>
              <el-table-column prop="updateBy" label="更新人" header-align="center" align="center"></el-table-column>
              <el-table-column prop="updateTime" label="更新时间" header-align="center" align="center"></el-table-column>
              <el-table-column prop="subject" label="事件名称" header-align="center" align="center" show-overflow-tooltip></el-table-column>
              <el-table-column prop="occurLocation" label="发生地点" header-align="center" align="center"></el-table-column>
              <el-table-column prop="lng" label="精度" header-align="center" align="center"></el-table-column>
              <el-table-column prop="lat" label="维度" header-align="center" align="center"></el-table-column>
              <el-table-column prop="occurGrid" label="发生网格ID" header-align="center" align="center"></el-table-column>
              <el-table-column prop="occurTime" label="发生时间" header-align="center" align="center"></el-table-column>
              <el-table-column prop="isImportant" label="是否重大" header-align="center" align="center"></el-table-column>
              <el-table-column prop="isUrgent" label="是否紧急" header-align="center" align="center"></el-table-column>
              <el-table-column prop="serialNumber" label="事件单号" header-align="center" align="center"></el-table-column>
              <el-table-column prop="source" label="事件来源" header-align="center" align="center"></el-table-column>
              <el-table-column prop="createDept" label="创建部门" header-align="center" align="center"></el-table-column>
              <el-table-column prop="issueStatus" label="事件状态" header-align="center" align="center"></el-table-column>
              <el-table-column prop="deptId" label="所属网络" header-align="center" align="center"></el-table-column>
<!--              <el-table-column prop="attachment" label="" header-align="center" align="center"></el-table-column>-->
              <el-table-column prop="hasAttachment" label="有无附件" header-align="center" align="center"></el-table-column>
              <el-table-column prop="hasDeadline" label="是否现时办结" header-align="center" align="center"></el-table-column>
              <el-table-column prop="isLocked" label="是否锁定" header-align="center" align="center"></el-table-column>
              <el-table-column prop="enterName" label="录入人员名称" header-align="center" align="center"></el-table-column>
              <el-table-column prop="doneTime" label="结案时间" header-align="center" align="center"></el-table-column>
              <el-table-column prop="collaborationNo" label="协同单号" header-align="center" align="center"></el-table-column>
              <el-table-column prop="collaborationSource" label="协调来源" header-align="center" align="center"></el-table-column>
              <el-table-column prop="level" label="事件等级" header-align="center" align="center"></el-table-column>
              <el-table-column prop="delFlag" label=""删除状态 header-align="center" align="center"></el-table-column>
              <el-table-column prop="qualityAnalysis" label="质量评析" header-align="center" align="center"></el-table-column>
              <el-table-column prop="lastProcessTime" label="最近办理时间" header-align="center" align="center"></el-table-column>
              <el-table-column prop="uringPersonId" label="催办人id" header-align="center" align="center"></el-table-column>
              <el-table-column prop="yellowSupervise" label="黄牌监督人id" header-align="center" align="center"></el-table-column>
              <el-table-column prop="yellowSuperviseCount" label="黄牌监督人次数" header-align="center" align="center"></el-table-column>
              <el-table-column prop="redSupervise" label="红牌监督人id" header-align="center" align="center"></el-table-column>
              <el-table-column prop="isTimeout" label="是否超时" header-align="center" align="center"></el-table-column>
              <el-table-column prop="categoryCode" label="事件类型编码" header-align="center" align="center"></el-table-column>
              <el-table-column prop="categoryName" label="事件类型名称" header-align="center" align="center"></el-table-column>
              <el-table-column prop="createDeptName" label="城建部门名称" header-align="center" align="center"></el-table-column>
              <el-table-column prop="currentDeptCode" label="当前部门组织编码" header-align="center" align="center"></el-table-column>
              <el-table-column prop="currentDeptName" label="当前部门组织名称" header-align="center" align="center"></el-table-column>
              <el-table-column prop="coordinateType" label="坐标系类型" header-align="center" align="center"></el-table-column>
              <el-table-column prop="isBeingInvalidated" label="是否作废申请中" header-align="center" align="center"></el-table-column>
              <el-table-column prop="isInstructions" label="是否领导批示事件" header-align="center" align="center"></el-table-column>
              <el-table-column prop="issueDescription" label="事件描述" header-align="center" align="center" show-overflow-tooltip></el-table-column>
              <el-table-column prop="isThereRiskCivilToCriminal" label="是否有民转刑、刑转民风险" header-align="center" align="center"></el-table-column>
               <el-table-column prop="genre" label="类别" header-align="center" align="center"></el-table-column>
      <el-table-column label="操作" fixed="right" header-align="center" align="center" width="150">

        <template v-slot="scope">
          <el-button v-if="state.hasPermission('demo:wenben:update')" type="primary" link @click="addOrUpdateHandle(scope.row.id)">修改</el-button>
          <el-button v-if="state.hasPermission('demo:wenben:delete')" type="primary" link @click="state.deleteHandle(scope.row.id)">删除</el-button>
          <el-button v-if="state.hasPermission('demo:wenben:export')" type="info" link @click="state.exportHandle(scope.row.id)">导出</el-button>
        </template>
      </el-table-column>
    </el-table>
    <el-pagination :current-page="state.page" :page-sizes="[10, 20, 50, 100]" :page-size="state.limit" :total="state.total" layout="total, sizes, prev, pager, next, jumper" @size-change="state.pageSizeChangeHandle" @current-change="state.pageCurrentChangeHandle"> </el-pagination>
    <!-- 弹窗, 新增 / 修改 -->
<!--    <add-or-update ref="addOrUpdateRef" @refreshDataList="state.getDataList">确定</add-or-update>-->
  </div>
</template>

<script lang="ts" setup>
  import useView from "@/hooks/useView";
  import {reactive, ref, toRefs} from "vue";

  import {ElMessage} from 'element-plus';

  const view = reactive({
  deleteIsBatch: true,
  getDataListURL: "/demo/wenben/page",
  getDataListIsPage: true,
  exportURL:"http://localhost:8080/renren-admin/demo/wenben/export",
  deleteURL: "/demo/wenben"
});
const state = reactive({ ...useView(view), ...toRefs(view) });
const Import_url="http://localhost:8080/renren-admin/demo/wenben/import";
const addOrUpdateRef = ref();
const addOrUpdateHandle = (id?: number) => {
  addOrUpdateRef.value.init(id);
};


//勾选的数据框列表
const multipleSelection = ref([]); // 使用 ref 定义响应式变量
const handleSelectionChange = (val: []) => {
  multipleSelection.value = val;
  console.log(val,multipleSelection)
};
function handleImport(res,file,fileList){
  console.log(res)
  if(res.code==0){
   ElMessage({
    message: '操作成功！',
    type: 'success',
   })
}else{
  ElMessage({
    message: '操作失败！',
    type: 'error',
   })
  }

}
</script>
